
Treinamento de Drupal para 
Administradores do Site 
“Bibliotecas UFU” 


Treinamento de Drupal para administradores do website da Biblioteca da UFU 

03/2010 


1. Como logar no sistema como usuário autenticado 

Para logar no sistema como usuário autenticado é necessário digitar /user na frente 
do nome do website. No exemplo do website da biblioteca da UFU seria: 
http://www.portal.bibliotecas.ufu.br/user . Posteriormente, quando o sistema estiver 
migrado para o website definitivo, o nome será http://www.bibliotecas.ufu.br/user . 

2. Como inserir um tipo de conteúdo 

O tipo de conteúdo é uma forma definida pelo Drupal para organizar os conteúdos 
do website de forma eficaz. Por padrão, alguns tipos de conteúdo já estão criados como, 
por exemplo, o tipo de conteúdo “artigos”. Uma forma de organizar os conteúdos é 
criar tipos de conteúdo para cada menu ou submenu. Outra forma é criar tipos de 
conteúdo para cada região ou assunto do website. 

Para criar tipos de conteúdo, inicialmente deve-se estar logado no sistema. Além 
disso, o usuário deve ter a permissão de inserção de conteúdos. Tendo estes parâmetros 
satisfeitos, clique sobre o menu “Organizar conteúdo/Tipos de conteúdo/Novo tipo de 
conteúdo”. Em seguida preencha o nome, tipo e a descrição do tipo de conteúdo. Por 
fim, clique no botão “salvar tipo de conteúdo”. 
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Figura 0: Inserção do tipo de conteúdo 
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3. Como inserir um conteúdo 


Conteúdo refere-se às informações que existem em um website. Ex: página com 
textos, fotos, vídeos ou documentos. 
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Para inserir um conteúdo no Drupal, inicialmente deve-se estar logado no 
sistema. Além disso, o usuário deve ter a permissão de inserção de conteúdos. 
Tendo estes parâmetros satisfeitos, clique sobre o menu “Organizar conteúdo/Criar 
conteúdo” e selecione o tipo de conteúdo que deseja inserir. A titulo de exemplo, 
escolha o tipo de conteúdo SISBI. Veja na figura abaixo: 



As Bibliotecas estarão fechadas no perío 
16/02/2010 por motivo de recesso de c 
reabrindo no dia 17/02/2010 às 14h. 

Solicitação Eletrônica de Documentos (I! 

Dia 12/02/2010 (6* feira) as Bibliotec# 
e Umuarama estarão fechadas por motivo de 

dedetÍ7arãn 

Figura 1 : Menu “Criar conteúdo’ 
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Em seguida, abrirá uma página que é vista na figura 2. Insira um título para este 
conteúdo. Caso queira linkar este conteúdo a um menu, clique sobre a opção 
“Configurações de menu”. Insira o título do link do menu. Na opção “Item superior”, 
insira o local onde o menu aparecerá. Caso queira que apareça na raiz do menu 
principal, deixe com está. No nosso exemplo, iremos inserir um conteúdo do tipo 
“SISBI”, então selecione o submenu “SISBI”. A opção “Peso”, refere-se em que 
seqüência você quer que o título do menu apareça dentro do submenu. Caso todos os 
pesos sejam iguais, a seqüência é definida por ordem alfabética. 


Início ► Criar conteúdo 

Criar SISBI 

Título: * 

▼ Configurações de menu 

Título do link do menu.: 

O texto desse item, o texto que deve aparecer no menu. Se você não quiser adicionar um link para este post no menu, deixe este campo em branco. 

Item superior: 

<Menu primário 

A profundidade máxima para um item e todos seus subitens está configurada para 9. Você não vai poder selecionar como "item superior" os itens que ficarem além desse limite. 

Peso: 

0 v 

Opcional. No menu, os itens mais pesados vão descer e os mais leves vão ser postos mais acima. 

Figura 2: Opção de inserção do título, título do menu, local de inserção do título do 
menu (Item superior) e a posição do título dentro do menu (Peso). 
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4. Como editar um conteúdo 


Para editar um conteúdo é necessário estar logado como usuário autenticado. 

Estando logado no sistema, basta acessar o conteúdo que deseja editar e clicar no botão 
editar como é visto na figura abaixo: 

Ver 

Figura 3: Botão Editar 

a. Trabalhando com o editor de texto do Drupal 

O editor de texto que estamos trabalhando é chamado Fck editor (figura 2). Com 
este editor de textos do Drupal, é possível inserir, editar ou deletar conteúdos de forma 
visual, fácil e eficiente. Este editor não possui todas as ferramentas que um software de 
edição de texto como, por exemplo, o Microsoft Word. Contudo, possui a maioria dos 
recursos necessários para inserir conteúdos para a web. 
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Figura 3: Fck Editor 


i. Alterando a fonte, cor da fonte, cor de fundo, tamanho da 
fonte, estilo e posicionamento. 

O editor de texto do Drupal permite que você altere a fonte do texto, cor e 
tamanho sem precisar utilizar o código html. Caso queira utilizar o código html, basta 
clicar no botão Código-Fonte, visto na imagem abaixo: 


Editar 


Í5Ú Código-Fonte 

Figura 4: Botão Código-Fonte 

A figura abaixo, apresenta os botões utilizados para alterar a fonte. Da esquerda 
para a direita temos as opções de negrito, itálico ou sublinhado. Alinhamento para 
esquerda, centralizado, direita e justificado. Opção de escolha da fonte de texto e o 
tamanho desejado. 

B I U ^ = Fonte T Tamanho T 

Figura 5: Botões de edição de texto básico 


ii. Inserindo marcadores e numeração 

Marcadores e numeração são importantes para citar e organizar um conteúdo. 
Abaixo temos os botões dos marcadores comum e numérico: 


Figura 6: Botão do marcador e numeração 
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iii. Copiar e colar 


O editor de texto Fck Editor permite que você copie e cole um conteúdo pré 
formatado de um outro documento. Existe também a opção de copiar e colar sem a 
formatação. Na figura abaixo, da esquerda para a direita temos o botão colar normal, 
colar sem formatação e o botão colar com formatação do Microsoft Word. 


g| © d 

Figura 7: Botões de colar 


iv. Inserindo links 

Para inserir links de outro website ou para o e-mail basta clicar no botão da 
esquerda, mostrado na figura abaixo. Caso queira remover um link, basta clicar no 
botão da direita. 


& 

Figura 8: Botões de link e unlink 

v. Localizando e substituindo palavras 

Para localizar uma palavra no texto, basta clicar no botão à esquerda, visto na 
imagem abaixo. Caso queira substituir uma palavra que aparece em diversos lugares no 
texto para uma outra palavra de uma vez, basta clicar no botão da direita mostrado 
abaixo e digitar o nome da palavra a ser substituída e a nova palavra. 


flfl A ■* 
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Figura 9: Botões de localizar e substituir 

vi. Inserindo tabelas 

Tabelas são importantes para organizar um conteúdo em diversas colunas e 
linhas permitindo aproveitar a área de exibição do conteúdo. Para inserir uma tabela 
basta clicar no botão mostrado do lado esquerdo, mostrado na figura abaixo. Caso 
queira formatar a tabela, selecione a tabela e clique no botão a direita, que é mostrado 
na figura abaixo. 
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Figura 10: Botões de inserção/edição e formatação de tabelas 


vii. Inserindo âncoras 

As ancoras são importantes quando o conteúdo é muito extenso. Assim, quando 
o usuário clica no sumario do conteúdo, o sistema automaticamente vai para a página 
onde está localizado o título. Para criar a ancora, selecione o local onde será ancorado. 
Clique no botão mostrado abaixo e após isso, crie um link onde esta ancora será 
chamada: 
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Figura 1 1 : Botão ancora 


viii. Inserindo fotos 

As fotos são importantes para ilustrar de forma efetiva o conteúdo que se 
pretende passar ao usuário final. Para inserir fotos, clique no ícone mostrado na figura 
11. Em seguida abrirá uma janela. Clique no botão “localizar no servidor”. 
Posteriormente, abrirá outra janela que é mostrado na figura 12. Com isso, realize os 
passos abaixo: 

• Clique no botão “Upload” localizado no canto superior esquerdo; 

• Clique no botão “Enviar arquivo...” 

• Selecione a foto que deseja postar no conteúdo e clique em abrir 

• Clique no botão “Upload” localizado a direita do botão “Enviar arquivo” 

• Clique no botão “Enviar para o fckeditor” 


UH 

Figura 12: Botão imagem 



Upload Miniaturas Apagar Redimensionar Enviar para fckeditor 


Arquivo: 

| Enviar arquivo... | 

] 



Criar miniaturas: IZl Small (90x90) 
(180x180) 

□ Médium (120x120) □ 

Large 



Navegação Nome do Arquivo 

Tamanho Largurr Altura 

Data 


1+1 Êjctools baseDadosAcessoTempor.jpg 

6.39 KB 

150 80 

02/09/2010 - 14:27 

/V 

[+1 ^imagecache BDPT.jpeg 

6.51 KB 

190 60 

02/09/2010 - 14:17 


g IÇj) imaqefield . celsius.jpeg 

11.21 KB 

151 77 

02/09/2010 - 14:28 


[+1 £j)imagefield_l ||VI 

[+1 Õimages |É> Yh CorretorconformeOrtografico.png 

1+1 Ic^languages 

65.39 KB 

61 62 

02/09/2010 - 14:20 



Figura 13: Janela de inserção de imagens 


ix. Inserindo vídeos 

Existem diversas formas de postar vídeos. A forma mais simples e econômica de 
exibir vídeos é utilizando o sistema do Youtube. A vantagem é que não é preciso salvar 
os vídeos que geralmente são grandes no servidor local. A desvantagem é que caso o 
vídeo não seja de sua autoria, existe o risco do usuário deletar o vídeo do Youtube. 
Portanto, procure postar vídeos de sua autoria. 

Para publicar vídeos do Youtube faça o seguinte: 

• Acesse o vídeo do Youtube que deseja publicar; 

• Copie (ctrl+c) o código html do vídeo como é visto na figura abaixo. 
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* - What is Drupal? (in 57 seconds) 
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24 de março de 
2009 

(mais informações) 

by pingVision LLC. The original video is posted at 
httpf/pingvision.comMdeo ... Is Drupal a CMS? Oris 
Drupal an Application Framework? Yes! This is a 
|brief íntroduction to Drupal. UPDATE: Thi... 

URL 
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Video2mp3: Convert « Download as MP3 (HO) 
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Após fazer sua seleção, copie e 
cole o código de incorporação 
acima. O código muda de acordo 
com a seleção. 

0 Incluirvídeos relacionados 

□ Mostrar contorno 

D Ativar o modo de privacidade aprimorada [?] 

□ Reproduzirem HD 


I kta« da ranrodiirá o 


Figura 14: Website do Youtube 

• Volte para o editor de texto do Drupal e clique no botão Código-fonte; 

• Cole (ctrl+v) o código no conteúdo e clique em pré-visualizar 


5. Outras informações sobre conteúdo 

a. Anexando documentos ao conteúdo 

Muitas vezes é necessário anexar documentos a um conteúdo. Seja normas, leis, 
regulamentos ou outro documento registrado. Para isso, o drupal permite, de forma 
simples e intuitiva, a opção de anexar documentos. 

Sendo assim, para realizar esta tarefa, no modo de edição de um conteúdo, existe 
a opção “File attachments” ( veja na figura 15). Clique nesta opção e em seguida clique 
no botão “Escolher arquivo” (figura 16). 

Selecione o documento desejado e clique em abrir. Em seguida clique no botão 
“Attach”. Marque a opção “Listar” e salve o conteúdo. 

► Formato de entrada 

► Informações da revisão 

► File attachments 


► Configurações dos comentários — 

► Autoria 

► Opções de publicação 

Figura 15: Opção de anexar documentos, File attachments 
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▼ File attachments 

Changes made to the attachments are not permanent until you save this post. The first "listed" file will be included in RSS feeds. 

Attach new file: 

1 Escolher arquivo J Nenhum ar... lecionado 

The maximum upload size is 1 MB, Only files with the following extensions may be uploaded: jpg jp&g gif png txt àoc xh pdf ppt pps odt oàs odp, 

I Attach ~1 


Figura 16: Botão “Escolher Arquivo” 


6. Organizando os menus 

O menu é um conjunto de itens, links que chamam os conteúdos. A organização do 
menu é essencial para que o usuário final consiga encontrar as informações com 
eficácia. 

No drupal, por padrão, existem dois menus criados. Porém podem-se criar outros 
menus caso seja necessário. No menu principal, costuma-se colocar as informações 
mais importantes. E no menu secundário, coloca-se informações adicionais. 

Para ajustar o posicionamento dos itens do menu, editar ou remover algum item do 
menu, clique em “Construção do site”, “Menus”. A titulo de exemplo, clique no menu 
primário. 

Na figura abaixo temos um exemplo de organização do menu primário. Existem 
duas opções de seleção para cada item de menu: 

• Ativado: Se selecionado exibe o link. Caso contrário, deixa oculto; 

• Expandido: Se selecionado, permite exibir os submenus caso exista. 

Além disso, para cada item existem duas operações: 

• Editar: Permite editar o item do menu. Pode-se alterar o link do menu, o título 
do link do menu e a descrição; 

• Apagar: Permite apagar o item do menu. 
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Menu primário 

Listar itens Novo item 


Editar menu 


Se você quiser reordenar itens de menu, dique no ícone de arrastar-e-soltar na coluna Item de menu e arraste o item para sua nova posição na lista. (Clique sobre o ícone e mantenh 
botão do mouse pressionado enquanto arrasta o item). Lembre-se que você deve clicar no botão "Salvar" no final da página para que as suas alterações sejam de fato salvas. 


Item de menu 

Ativado 

Expandido 

Operações 


♦J. Página principal 

0 

□ 

editar 

apagar 

♦f SISBI 

0 

0 

editar 

apagar 

* 

Administração 

0 

□ 

editar 

apagar 

* 

Bibliotecas 

0 

□ 

editar 

apagar 

❖ 

Dados Estatísticos 

0 

□ 

editar 

apagar 

* 

Histórico 

0 

□ 

editar 

apagar 

* 

Missão 

0 

□ 

editar 

apagar 


Organograma 

0 

□ 

editar 

apagar 

* 

Publicações 

0 

0 

editar 

apagar 


Guia do Usuário 

0 

□ 

editar 

apagar 


+ SISBI Notícias 

0 

□ 

editar 

apagar 

* 

Regulamento 

0 

□ 

editar 

apagar 

* 

teste 

0 

□ 

editar 

apagar 

«1* Espaços especializados 

0 

0 

editar 

apagar 

♦í* 

Hall Interno - Exposições 

0 

□ 

editar 

apagar 

* 

Ilha de Pesquisa 

0 

□ 

editar 

apagar 

* 

Laboratório de Informática 

0 

□ 

editar 

apagar 

* 

NEC - Núcleo de Estudos Canadenses 

0 

□ 

editar 

apagar 

* 

Sala de Reserva 

0 

□ 

editar 

apagar 

* 

Sala de recursos audiovisuais 

0 

□ 

editar 

apagar 

•3» Catálogo on-line 

0 

0 

editar 

apagar 


Figura 17: Página de edição do menu 


Pode-se também hierarquizar os itens de menu. Por exemplo, ao “arrastar” um item de 
menu, pode-se posiciona-lo onde melhor desejar. 

7. Organizando a página principal 

Como podemos ver na figura abaixo, a página principal possui 3 colunas. Na primeira 
coluna temos dois blocos: 

• Bloco notícia: Exibe as últimas 10 notícias publicadas; 

• Bloco slideshow: Exibe uma seqüência de fotos da biblioteca aleatoriamente. 
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Sistema de Bibliotecas - SISBI 

Filiada a CBBU 

Universidade Federal de Uberlândia 


Página principal SISBI Espaços especializados Catálogo on-line Serviços Portal da pesquisa Contato Horários Renovaçáo Reserva 


Notícias Destaques serviços Destaques pesquisas 




As Bibliotecas estarão fechadas no período de 13 a 
16/02/2010 por motivo de recesso de carnaval, 
reabrindo no dia 17/02/2010 às 14h. 

Solicitação Eletrônica de Documentos (ISTEC/LIGDOC) 
Dia 12/02/2010 (6 a feira) as Bibliotecas Santa Mõnica 
e Umuarama estarão fechadas por motivo de 
dedetização 

A DIRBI informa o início dos processos de aquisição de 

material informacional de 2010 

Horário de funcionamento das Bibliotecas UFU no 

período de 16/01a 28/02/2010 

Novo Portal de Periódicos Capes 

Guia da internet 2009 

Renovações Bibliotecas UFU 

Novas regras dos serviços de empréstimo das 

Bibliotecas 

Atenção para o número máximo de renovações 
permitido por obra emprestada! 



ü 
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GRU 
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^ de UbeilâmJíd 


Guia de 

Recolhimento da União 


So r c*toçõo ® I 
OnPne de moterial 
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e e © 

elsius 


Solicitação eletrônica de documentos 

s 

Figura 18: Página principal 


lf|jjl fiíbre 

Mecanismo Online para 
Referências 


NAXOS 

Music Lebrary 




Corretor conforme acordo ortográfico 


Na segunda coluna, temos 5 blocos: 

• Bloco GRU: É uma imagem que está linkada ao conteúdo GRU 

• Bloco Solicitação On-line de material informacional: É uma imagem que está 
linkada ao conteúdo; 

• Bloco Bases de dados de acesso temporário: É uma imagem que está linkada ao 
conteúdo; 

• Bloco Celsius: É uma imagem que está linkada ao conteúdo; 

• Bloco Levantamento Bibliográfico: É uma imagem que está linkada ao 
conteúdo; 

Na terceira coluna temos 6 blocos, cada um linkado ao seu conteúdo destino. 


a. Como inserir um novo bloco 

Caso deseje inserir outro bloco, vá no menu “Construção de site”, “Blocos”, 
“Novo Bloco”. Preencha o campo “Descrição do bloco”. Caso queira, insira o título do 
bloco. No corpo do bloco, insira a imagem, link ou conteúdo que desejar. 
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Notícias 

Figura 19: Menu de edição dos blocos 


Em seguida, clique no menu “Construção do site”, “Paneis”. 



j bloco, exibida na visão geral da área administração de blocos. 


Figura 20: Menu de edição da página principal 


Selecione a opção “Panei page” e em seguida clique em “Listar”. Encontre a 
panei page “inicial” e clique em “Operações”, “Panei content”. Na figura abaixo, temos 
a página de edição da página principal: 
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Paneis 


Dãshboard | 


Create new 



Panei page 

íãnê^agê^ãTbe used as landing pages. They have a URL path, accept 
arguments and can have menu entries. 

Advanced panei page 

Advanced panei pages have everything regular pages do, and can have different 
layouts depending on the data being viewed. 

Panei node 

Panei nodes are node content and appear in your searches, but are more limited 
than panei pages. 

Mini panei 

Mini paneis are small content areas exposed as blocks, for when you need to 
have complex block layouts or layouts within layouts. 


Figura 21: Panei page 


Início Administrar Construção do site Páginas 

Editar 

Panei content Page settings Argument settings Contexts Change layout Access control Configurações de menu 
▼Display settings 



Figura 22: Página de edição da página principal 


Observe na figura acima que a página principal possui três colunas. A titulo de 
exemplo, escolha a coluna do meio (Middle collum). Clique no sinal positivo localizado 
no canto superior esquerdo da coluna “Middle collum”. Clique em “Add content”. Uma 
nova janela será aberta como visto na figura abaixo: 
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Add contentto Middie column 


£y 


Activity 

i ~) Bases de dados de acesso temporário 

0 Naxos 

Menus 

i ~~] Biblioteca Digital de Peças Teatrais 

0 notícias 

Miscellaneous ► 

1 ~~) Biblioteca Digital de Teses e Dissertações 

lõjjl Noticias slide show 

Views 

1 ~~) Celsius 

0 Novas aquisições 

V/idgets 

1 ~~] Corretor conforme acordo ortográfico 

0 Periódicos capes 

| Add a node 

i ~~) Destaques pesquisas 

0 Rodapé 

éfj New custom content 

! ~| Destaques serviços 

(j| Siblingmenu Tree Display 

,g) Extended Primary Links 

0 Slide show espaçamento 


Q GRU 

0 Soliçitação On-line de material informacional 


(á|| Imagens slide show 

0| Submenu Tree Display 


0 jstor 

0 Traduto babylon 


0 Levantamento bibliográfico 

0 Treinamentos 


I ~] More 


Figura 23: Janela de seleção do bloco 


Clique na opção Miscellaneous e escolha o bloco que deseja inserir. Em seguida, clique 
no botão “finish”. 


b. Como editar ou deletar um bloco 

Caso queira editar um bloco da página inicial, passe o mouse por cima do bloco. 
Em seguida aparecerá a opção “Configurar bloco” como mostrado no exemplo abaixo. 
Clique nesta opção e edite ou apague caso necessário. 


[Configurar 

bloco] 


lífjjí itibrp 

Mecanismo Online para 
Referências 


Figura 24: Bloco de exemplo com a opção de configurar o bloco 


8. Organizando o slide show 

O Slide show é um módulo do Drupal que permite a exibição de imagens de forma 
aleatória ou seqüencial. 

a. Como configurar a exibição 

Passe o mouse por cima do bloco de exibição do slide show e clique em 
“Configurar Bloco”. Na página que será aberta, pode-se definir a quantidade máxima de 
fotos para exibir, a altura e largura da imagem, o efeito de visualização de uma foto para 
outra, a ordem de exibição, etc. 

b. Como inserir ou deletar imagens 

Para inserir ou deletar imagens, clique no menu “Organizar conteúdo”, 
“Conteúdo”, “Listar”. 
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Em seguida, filtre a pesquisa dos conteúdos por tipo: “Imagem do slide show” 
como é visto na figura abaixo: 

Conteúdo 


Exibir apenas itens que 


® status 
tipo 

O língua 


Opções de atualização 


Publicar 


publicado 


Artigo 


Artigo 
Bibliotecas 
Catálogo On-line 
Contato 

Espaços especializados 


Imagem do slideshow 


□ Título 


□ 


Controle de imac Página 
" SISBI 


□ teste 


Inicio 

Notícias 

Panei 

Portal da pesquisa 


Serviços 

Webform 


I Filtro I 


how atualizado 


□ 


As Bibliotecas estarão fechadas no período de 13 a 16/02/2010 por motivo de recesso d 
carnaval p reabrindo no dia 17/02/2010 às 14h. 


□ História 

Figura 25: Filtro de pesquisa de conteúdo do tipo “Imagem do slide show” 


Clique no botão “Filtro”. Em seguida, clique em “editar”. Com isso, uma a 
página de edição de imagens do slide show será aberta como visto na imagem abaixo: 
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Controle de imagens de exibição do slide show 

Ver Editar 
Título: * 

Controle de imagens de exibição do slide show 

Insira a imagem no slideshow: 

Removê~| 




1 Remove | 










Figura 26: Página de edição do Slide show 


Caso queira remover a imagem, clique em “Remove”. Se desejar inserir uma 
nova imagem, clique no botão “escolher arquivo”. Selecione o arquivo, clique em abrir 
e em seguida clique no botão “Upload”. Caso queira inserir mais imagens, clique no 
botão “Add another item” e repita o passo anterior, caso contrário, clique no botão 
salvar no final da página. 


* 


[ Escolher arquivo j Nenhum ar... lecionado 

Maximum Filesize: 15 MB 


Upload 


Allowed Extensions: jpg jpeg g/f png 


Add another item~| 

Figura 27: Opção de inserção de imagens no Slide show 
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9. Organizando o bloco notícia 


O bloco noticia permite que o usuário final visualize as últimas notícias postadas no 
website. Este bloco na verdade é uma view. A view é um módulo do Drupal que 
permite filtrar os conteúdos criados e exibe na forma de lista. No nosso caso, estamos 
filtrando o tipo de conteúdo “notícia”. 

a. Como configurar a exibição da notícia 

Passe o mouse sobre o bloco noticia e clique em “Editar”. A página de edição da 
View será aberta. Nesta página é possível limitar a quantidade de notícias exibidas, 
definir o tipo de ordenação da noticias, inserir cabeçalho, alterar o tipo de exibição das 
noticias, inserir rodapé, alterar os filtros de dados, etc. 


b. Como inserir ou deletar as noticias 

Para editar uma notícia já existente, clique na notícia e clique no botão “editar”. 
Se quiser deletar, clique no botão “apagar”. Caso deseje criar uma nova notícia, clique 
no menu “Organizar conteúdo”, “Criar conteúdo”, “Noticia”. Dessa forma, insira o 
título e o conteúdo desejado. 
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